<template>
	<view class="detail" @click="goDetails">
		<view class="detail_picture">
			<view class="picture">
				<image :src="props.url" mode=""></image>
			</view>
			<text>{{ props.content }}</text>
		</view>
		<image src="../static/icons/右箭头.png" mode=""></image>
	</view>
</template>

<script setup>
import { onMounted, ref } from 'vue';
import { onShow } from '@dcloudio/uni-app';
import { useMyStore } from '@/stores/myStore.js';
const store = useMyStore();
let token = ref();
const props = defineProps({});
const pages = getCurrentPages();
onMounted(() => {
	store.getLogin();
	token.value = uni.getStorageSync('token');
});
onShow(() => {
	token.value = uni.getStorageSync('token');
});
const goDetails = () => {
	if (!token.value.username) {
		uni.showToast({
			icon: 'none', // 设置提示框的图标，这里设置为无图标
			title: '请先登录', // 提示框的标题
			duration: 2000 // 提示框的持续时间，单位为毫秒，这里设置为2000毫秒，即2秒
		});
	} else {
		if (pages[0].route == 'pages/home/home') {
			uni.navigateTo({
				url: '/pages/announcement/announcement'
			});
		}
		if (props.content === '我的房屋') {
			uni.navigateTo({
				url: '/pages/myHouse/myHouse'
			});
		}
		if (props.content === '我的车位') {
			uni.navigateTo({
				url: '/pages/myStall/myStall'
			});
		}
		if (props.content === '我的车辆') {
			uni.navigateTo({
				url: '/pages/myVehicle/myVehicle'
			});
		}
		if (props.content === '我的收藏') {
			uni.navigateTo({
				url: '/pages/myCollect/myCollect'
			});
		}
		if (props.content === '我的租房') {
			uni.navigateTo({
				url: '/pages/myRent/myRent'
			});
		}
		if (props.content === '访客记录') {
			uni.navigateTo({
				url: '/pages/myGuest/myGuest'
			});
		}
		if (props.content === '缴费记录') {
			uni.navigateTo({
				url: '/pages/server/views/PayRecord/PayRecord'
			});
		}
	}
};
</script>

<style lang="scss">
.detail {
	width: 100%;
	height: 100rpx;
	line-height: 100rpx;
	text-align: center;
	border-radius: 20rpx;
	display: flex;
	align-items: center;
	justify-content: space-around;

	.detail_picture {
		width: 600rpx;
		display: flex;
		align-items: center;

		.picture {
			height: 100%;
			display: flex;
			align-items: center;
			justify-content: center;
			image {
				width: 60rpx;
				height: 60rpx;
				margin-right: 20rpx;
			}
		}

		text {
			width: 560rpx;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
		}
	}

	image {
		width: 40rpx;
		height: 40rpx;
	}
}
</style>
